/* eslint-disable */
import React, { Component } from 'react';
import {
  View,
  Text,
  Image,
  StyleSheet,
} from 'react-native';
import { SafeAreaView } from 'react-navigation';
import screnInfo from '../utils/View';
import BaseStyle from '../constants/Style';
import { QUESTION_LIST } from '../constants/Api';
import { form_req } from '../utils/Request';
import Pull_Load from "../components/pull_load";

export default class PullAndLoadScreen extends Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [
      ],
      nomore: false,
      pageSize: 0,
      pageNumber: 1,
    };
  }
  componentDidMount() {  //初始化的时候要判断长度 控制上拉加载

    const ListNums = this.fullScreenJusting(50);
    this.setState({
      pageSize: ListNums
    })
    this.onEndReachedCalled = false;
    this.getOrderList(ListNums, 1, true);

  }
  //满屏页面判断
  fullScreenJusting(ItemHeight) {
    const screnHeight = screnInfo.size.height;     //屏幕高度
    //计算列表个数
    const listNum = (screnHeight - 40) / ItemHeight;
    return Math.ceil(listNum);
  }

  getOrderList(ListNums, pageNumber, fresh) {
    let nomore;
    form_req(QUESTION_LIST, {
      page: pageNumber,
      perpage: ListNums,
    }).then(res => {
      if (res.code == 200) {
        const item = res.data;
        if (item.length < ListNums) {
          nomore = true
        } else {
          nomore = false
        }
        if (fresh) {
          this.setState({
            data: item,
            nomore: nomore
          })

        } else {
          this.setState({
            data: this.state.data.concat(item),
            nomore: nomore,
          })
        }

      } else {

      }
    });
  }

  _onEndReached = () => {
    if (!this.state.nomore && this.onEndReachedCalled) {
      this.getOrderList(this.state.pageSize, ++this.state.pageNumber, false);
    }
    this.onEndReachedCalled = true;

  };
  _onRefresh() {
    this.setState({ nomore: false, pageNumber: 1 }, () => {
      this.getOrderList(this.state.pageSize, 1, true);
    })

  }
  renderItem(item){
    return (
      <View style={styles.item}>
        <Text>{item.name}</Text>
      </View>
    );
  };

  _keyExtractor = (item) => item.id;


  render() {
    return (
      <SafeAreaView style={BaseStyle.flex}>
        <View style={styles.listConten}>
        <Pull_Load
          data={this.state.data}
          keyExtractor={this._keyExtractor}
          onEndReached={this._onEndReached}
          nomore={this.state.nomore}
          renderItem={this.renderItem.bind(this)}
          onRefresh={this._onRefresh.bind(this)}
        />
        </View>
      </SafeAreaView>
    );
  }
}

const styles = StyleSheet.create({
  listConten: {
    flex: 1,
    backgroundColor: '#ffffff',
  },
  item: {
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: "center",
    backgroundColor: '#ffffff',
    height: 50,
  },


  
  
});
